After you build the image map in the Fireworks PNG document, you must export the image map before it actually functions as an image map in a Web browser.
Exporting an image map generates a variety of files.
|
Exporting a client-side image map generates the graphic file and the HTML file containing map information for hotspots and corresponding URL links. |
|
Exporting a server-side image map generates the graphic file, a separate map file, and an HTML file containing a link to the map file. |
Exporting a sliced image map typically generates many graphic files. For more information about slicing, see Drawing slice objects.
To export an image map:
| 1 | Optimize the graphic to prepare it for export. |
| For more information on Optimizing graphics in the workspace, see Optimizing in the workspace. | |
| 2 | Choose File > Export to open the dialog box. |
| 3 | Navigate to the folder in which to place the graphic file, and name the file. |
| If you have already built a local file structure for your Web site, you can save the graphic in the appropriate folder for the site from here. Disregard the Slicing option for now. | |
| 4 | Choose an HTML Style format. |
| Choosing any option other than None instructs Fireworks to generate an HTML document upon export. For more information about HTML Styles, see Exporting an HTML file. | |
| 5 | Click the Browse button and navigate to the folder in which to place the HTML files. |
| If you chose Dreamweaver 3 Library.lbi in step 4, you must place the HTML file in a folder named Library and locate that folder at the root level of your Web site. | |
| 6 | Click Save to export the image map. |
| 7 | For server-side image maps, open the exported HTML file, and enter the URL path to the map file where it is placed on the server. |
 |
You can open the HTML file that Fireworks generates for the image map and copy and paste the image map code into another HTML file. Fireworks uses HTML notes to clearly label the beginning and end of code for image maps and other Web features created in Fireworks.
The Update HTML feature delivers Fireworks-generated HTML to the right location within HTML files in your Web site. For information on placing image maps into Dreamweaver or another HTML editor, see Placing Fireworks files in Dreamweaver.